<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ol加载arcgisserver4490图层</title>
    <link rel="stylesheet" href="https://data.sunbt.ltd/lib/ol/v6.15.1/css/ol.css" type="text/css">
    <script src="https://cdn.bootcdn.net/ajax/libs/proj4js/2.9.0/proj4.js"></script>
    <script src="https://data.sunbt.ltd/lib/ol/v6.15.1/build/ol.js"></script>
    <style>
        body {
            margin: 0;
            padding: 0;
        }

        #map {
            position: absolute;
            top: 0;
            bottom: 0;
            width: 100%;
        }
    </style>
</head>
<body>
<div id="map"></div>
<script>
    // 注册EPSG:4490投影
    proj4.defs("EPSG:4490","+proj=longlat +ellps=GRS80 +no_defs +type=crs");
    ol.proj.proj4.register(proj4);

    // 获取EPSG:4490投影对象和相关参数
    let projection4490 = ol.proj.get('EPSG:4490');
    let fullExtent = [-180, -90, 180, 90];
    let width4490 = ol.extent.getWidth(fullExtent);
    let resolutions4490 = [];
    for (let z = 1; z < 18; z++) {
        resolutions4490[z] = width4490 / (256 * Math.pow(2, z));
    }

    // 创建XYZ瓦片数据源的图层
    let mapServer = new ol.layer.Tile({
        source: new ol.source.XYZ({
            url: 'https://jiangsu.tianditu.gov.cn/mapjs2/rest/services/MapJS/js_yxdt_latest/MapServer/tile/{z}/{y}/{x}',
            projection: projection4490,
            tileGrid: new ol.tilegrid.TileGrid({
                tileSize: 256,
                origin: ol.extent.getTopLeft(fullExtent),
                extent: fullExtent,
                resolutions: resolutions4490
            })
        }),
        visible: true
    });

    // 初始化地图
    let map = new ol.Map({
        target: 'map',
        layers: [
            // 这里添加你的天地图图层或者其他图层
            mapServer
        ],
        view: new ol.View({
            projection: 'EPSG:4490',
            center: [119.86, 32.95],
            zoom: 7.8,
            maxZoom: 19
        })
    });
</script>
</body>
</html>